<template>
    <div>
        <!-- 添加栏目 -->
        <el-form :inline="true">
            <el-form-item>
                <el-input v-model="name" placeholder="名称" />
            </el-form-item>
            <el-form-item>
                <el-button type="primary" @click="submit">添加</el-button>
            </el-form-item>
        </el-form>

        <search-item v-for="(item, idx) in tableData" :item="item" :key="item.id"></search-item>
    </div>
</template>

<script setup>
import searchItem from "@/components/searchItem.vue";
import config from "@/config";
import router from "@/router";
import { get, post } from "@/utils/http";
import { onMounted, reactive, ref } from "vue";



const name = ref("")
const tableData = reactive([])



onMounted(async () => {
    let resp = await get(config.config.getSearchCategory + "?private=true")
    if (resp.data.errCode == 0) {
        for (const item of resp.data.items) {
            tableData.push(item)
        }
    }
})


const submit = () => {
    if (name.value.length < 1) {
        return
    }
    post(config.config.addSearchCategory, { "name": name.value }).then((resp) => {
        let res = resp.data
        if (res.errCode != 0) {
            alert(res.data)
        } else {
            router.go(0)
        }
    })
}
</script>

<style scoped>
.form {
    width: 100%;
}
</style>
